<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>第二轮测试</title>
    <link rel="icon" href="/images/touxiang.ico" type="image/x-icon">
    <link rel="stylesheet" href="style.css">
    <script src="jQuery.js"></script>
    <script src="formjson.js"></script>
    <script type="text/javascript">
        function displaySubMenu(li) {
            var subMenu = li.getElementsByTagName("ul")[0];
            subMenu.style.display = "block";
        }

        function hideSubMenu(li) {
            var subMenu = li.getElementsByTagName("ul")[0];
            subMenu.style.display = "none";
        }
    </script>
</head>

<body>
    <img src="../images/fantang.png" alt="" id="logo">
    <ul id="navigation">
        <li onmouseover="displaySubMenu(this)" onmouseout="hideSubMenu(this)">
            <center><a href="#">你想看的</a></center>
            <ul>
                <li><a href="/index.html">我的主页</a></li>
                <li><a href="1.html">第一轮测试</a></li>
                <li><a href="2.html">第二轮测试</a></li>
                <li><a href="3-1.html">第三轮测试</a></li>
                <li><a href="4.html">第四轮测试</a></li>
            </ul>
        </li>
    </ul>

    <div id="container">
        <div id="content">
            <div id="begin">
                <h1>第二轮测试</h1>
                <h1>以下是上一轮的整体结果</h1>
                <div id="data1"></div>
                <div id="data2"></div>
                <div id="data3"></div>
                <br><br>
                <p>请填写以下问题<br>
                </p>
            </div>
            <form id="form">
                <div id="photos">
                    <div class="useName">
                        <p><label for="useName">1.您的姓名：</label><input type="text" name="e-name" id="useName" /></p><br>
                        <p><label for="useNo">2.您的序号：</label><input type="text" name="&#34e_id&#34" id="useNo" /></p>
                    </div><br>
                    <p>2.请选出适合您对学一食堂（东区一楼）的评价：<br>
                        <input type="checkbox" name="pinjia1" value="干净卫生">干净卫生&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia1" value="食材新鲜">食材新鲜&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia1" value="饭菜分类足">饭菜分类足&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia1" value="价格实惠">价格实惠&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia1" value="饭菜有特色">饭菜有特色&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia1" value="排队久">排队久&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia1" value="吃出杂物">吃出杂物&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia1" value="味道差">味道差&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia1" value="菜品单一">菜品单一&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia1" value="食堂座位少">食堂座位少&nbsp;&nbsp;&nbsp;
                    </p><br>
                    <p>2.请选出适合您对禾园食堂（东区二楼）的评价：<br>
                        <input type="checkbox" name="pinjia2" value="干净卫生">干净卫生&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia2" value="食材新鲜">食材新鲜&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia2" value="饭菜分类足">饭菜分类足&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia2" value="价格实惠">价格实惠&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia2" value="饭菜有特色">饭菜有特色&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia2" value="排队久">排队久&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia2" value="吃出杂物">吃出杂物&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia2" value="味道差">味道差&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia2" value="菜品单一">菜品单一&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia2" value="食堂座位少">食堂座位少&nbsp;&nbsp;&nbsp;
                    </p><br>
                    <p>3.请选出适合您对林园食堂（东区三楼）的评价：<br>
                        <input type="checkbox" name="pinjia3" value="干净卫生">干净卫生&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia3" value="食材新鲜">食材新鲜&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia3" value="饭菜分类足">饭菜分类足&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia3" value="价格实惠">价格实惠&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia3" value="饭菜有特色">饭菜有特色&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia3" value="排队久">排队久&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia3" value="吃出杂物">吃出杂物&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia3" value="味道差">味道差&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia3" value="菜品单一">菜品单一&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia3" value="10">食堂座位少&nbsp;&nbsp;&nbsp;
                    </p><br>
                    <p>4.请选出适合您对学二食堂（西区一楼）的评价：<br>
                        <input type="checkbox" name="pinjia4" value="干净卫生">干净卫生&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia4" value="食材新鲜">食材新鲜&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia4" value="饭菜分类足">饭菜分类足&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia4" value="价格实惠">价格实惠&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia4" value="饭菜有特色">饭菜有特色&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia4" value="排队久">排队久&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia4" value="吃出杂物">吃出杂物&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia4" value="味道差">味道差&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia4" value="菜品单一">菜品单一&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia4" value="食堂座位少">食堂座位少&nbsp;&nbsp;&nbsp;
                    </p><br>
                    <p>5.请选出适合您对齐芳阁（西区二楼）的评价：<br>
                        <input type="checkbox" name="pinjia5" value="干净卫生">干净卫生&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia5" value="食材新鲜">食材新鲜&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia5" value="饭菜分类足">饭菜分类足&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia5" value="价格实惠">价格实惠&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia5" value="饭菜有特色">饭菜有特色&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia5" value="排队久">排队久&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia5" value="吃出杂物">吃出杂物&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia5" value="味道差">味道差&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia5" value="菜品单一">菜品单一&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia5" value="食堂座位少">食堂座位少&nbsp;&nbsp;&nbsp;
                    </p><br>
                    <p>6.请选出适合您对林汇园（西区三楼）的评价：<br>
                        <input type="checkbox" name="pinjia6" value="干净卫生">干净卫生&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia6" value="食材新鲜">食材新鲜&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia6" value="饭菜分类足">饭菜分类足&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia6" value="价格实惠">价格实惠&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia6" value="饭菜有特色">饭菜有特色&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia6" value="排队久">排队久&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia6" value="吃出杂物">吃出杂物&nbsp;&nbsp;&nbsp;<br>
                        <input type="checkbox" name="pinjia6" value="味道差">味道差&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia6" value="菜品单一">菜品单一&nbsp;&nbsp;&nbsp;
                        <input type="checkbox" name="pinjia6" value="食堂座位少">食堂座位少&nbsp;&nbsp;&nbsp;
                    </p><br>
                </div>
            </form>
            <div align="center" id="header">
                <div id="anniu"><a onClick="submitToNextPage()"> 完成测试</a></div>
            </div>
        </div>
    </div>
    <script>
        let storageItemName = "nl-formJson";

        $(function () {
            // json信息加载到form表单中
            loadStorageJsonToForm({
                item: storageItemName
            });

            // 定时器显示rang类型字段,实际使用没有此类型值可去除此段代码
            setInterval(function () {
                $("#rate_text").text($(form).find("[name='rate']").val() + "%");
            }, 0.01);
        });

        /** 提交当前页表单，并跳转到下一页 */
        function submitToNextPage() {
            let json = $("#form").serializeJson();
            //console.log(json);
            var temp3 = [];
            for (var i = 0; i < 6; i++) {
                var temp31 = new Object();
                temp31.e_id = Number(json["\"e_id\""]);
                temp31.c_id = i + 1;
                var pp = i + 1;
                var p = "pinjia" + pp;
                temp31.comment = json[p];
                temp3[i] = temp31;
            }
            var tempJson = JSON.stringify(temp3); //这里给当前专家的对每一个食堂的评价
            //temp = "(" + temp + ")";
            $.get("/app3Router", tempJson, function (d) {
                //alert(d);
            });
            //console.log(temp3);
            //console.log(tempJson);
            serialFormJsonToStorage({
                item: storageItemName
            });
            saveFormData();
            window.localStorage.removeItem(storageItemName);
            alert("提交成功");
            window.location = "finish.html";
        }

        /** 提交当前页表单 */
        function submitForm() {
            let json = $("#form").serializeJson();
            //console.log(json);
            //alert("保存成功");
        }

        function saveFormData() {
            json = serialFormJsonToStorage({
                item: storageItemName
            });
        }

        function submit() {
            saveFormData();
            // 最后一步提交后需要移除storageItemName,避免影响下一次表单填写的json信息
            window.localStorage.removeItem(storageItemName);
            window.location = "finish.html";
        }


        $.get("/app6Router", {}, function (data) {
            var ul = $("<ul></ul>");
            data = eval(data);
            for (var i = 0; i < data.length; i++) {
                var user = data[i];
                var li = "<li>" + "第" + (i + 1) + "个食堂的平均分为：" + user.q1ave + "</li>";
                ul.append(li);
            }
            //console.log(ul);
            $("#data1").append(ul);
        });
        $.get("/app7Router", {}, function (data) {
            var ul = $("<ul></ul>");
            data = eval(data);
            for (var i = 0; i < data.length; i++) {
                var user = data[i];
                var li = "<li>" + "第" + (i + 1) + "个食堂的评价等级为：" + user.c_level + "</li>";
                ul.append(li);
            }
            //console.log(ul);
            $("#data2").append(ul);

        });
        $.get("/app4Router", {}, function (data) {
            var ul = $("<ul></ul>");
            data = eval(data);
            for (var i = 0; i < data.length; i++) {
                var user = data[i];
                var li = "<li>" + "第" + (i + 1) + "个食堂的满分频度为：" + user.fullmark + "</li>";
                ul.append(li);
            }
            //console.log(ul);
            $("#data3").append(ul);

        });
    </script>
</body>

</html>